<template>
  <j-modal
    :title="title"
    :width="1100"
    :visible="visible"
    @cancel="onCancel"
    :confirmLoading="confirmLoading"
    :footer="null"
    switchFullscreen
  >

    <a-tabs default-active-key="1" @change="callback">
      <a-tab-pane key="1" tab="详情">
        <!-- 表单详情 根据不同表单添加-->
        <apply-leave-form ref="applyForm" v-if="leaveVisible" :disabled="leaveVisible"></apply-leave-form>

      </a-tab-pane>
      <a-tab-pane key="2" tab="流程图" force-render>
        <div style="width:100%;text-align: center;">
          <img alt="流程图获取失败" :src="previewImage" />
        </div>
      </a-tab-pane>
      <a-tab-pane key="3" tab="审批" force-render>
        <!-- 审批选项 -->
        <!-- 审批记录 -->
        <approval-op ref="approvalOp" @close="close" @getList="getList"></approval-op>
      </a-tab-pane>
    </a-tabs>

  </j-modal>
</template>

<script>
  import { getAction, postAction } from '@/api/manage'
  import { mixinDevice } from '@/utils/mixin'
  import ApplyLeaveForm from '../apply/modules/ApplyLeaveForm'
  import ApprovalOp from './ApprovalOp'

  export default {
    name: 'ApprovalModal',
    mixins: [ mixinDevice],
    components: {
      ApplyLeaveForm, ApprovalOp
    },
    data() {
      return {
        title: '审批',
        visible: false,
        confirmLoading: false,
        leaveVisible: false,
        task: {},
        previewVisible: false,
        previewImage: ''
      }
    },
    methods: {
      getList() {
        this.$emit('getDataList')
      },
      // 获取流程图
     getPreviewImage() {
       let processId = this.task.processInstanceId
      this.previewImage = window._CONFIG['domianURL'] + '/approval/task/processImg/' + processId

      // postAction(url, param).then(res => {
      //   console.log('获取流程图', res)
      // })
     },
      handleCancel() {
        this.previewVisible = false
      },
      callback(key) {
        console.log(key)
        if (key === '3') {
          let task = this.task
           this.$refs.approvalOp.openOp(task)
        }
        if (key === '2') {

        }
      },
      openModel(val) {
         this.visible = true
         this.task = val
         console.log('任务节点信息', val)
         let task = val.taskUrl.split('/')
         let formKey = task[0]
         let formId = task[1]
         // 请假
         if (formKey === 'leave') {
             this.leaveVisible = true
             this.$nextTick(() => {
               this.$refs.applyForm.approvalDetail(formId)
             })
         }
         // 领用
         if (formKey === 'goods') {

         }

         this.getPreviewImage()
      },
      onCancel() {
        this.visible = false
      },
      close() {
        console.log('关闭弹出')
        this.visible = false
      }
    }
  }
</script>

<style>
   @import '~@assets/less/common.less';

</style>
